import React from 'react'
import { bindActionCreators } from 'redux'
import Head from '../../components/Head'
import withRedux from 'next-redux-wrapper'
import Nav from '../../components/Nav/Nav'
import { initTotalStore } from '../../store/store'
import { getUserInfo } from '../../store/user.redux'
import AntdLayout from '../../components/AntdLayout'
import ArticleContent from '../../components/Article/ArticleContent'

class index extends React.Component {
    constructor(props) {
        super(props)
    }

    componentDidMount() {
        this.props.getUserInfo()
    }

    render() {
        return (
            <AntdLayout>
                <div className="index">
                    <Head title="article" />
                    <Nav />
                    <ArticleContent />
                    <style jsx>{`
                        .index {
                            min-height: 100%;
                            height: auto;
                            background-color: #f6f6f6;
                        }
                        .content {
                            display: flex;
                            margin: -55px auto 0;
                            max-width: 840px;
                            height: 100%;
                        }
                    `}
                    </style>
                </div>
            </AntdLayout>
        )
    }
}

const mapDispatchToProps = (dispatch) => {
    return {
        getUserInfo: bindActionCreators(getUserInfo, dispatch)
    }
}
export default withRedux(initTotalStore, null, mapDispatchToProps)(index)